<template>
    <div>
        <button v-yzh.aaa.bbb="'ace,sabo'" @click="increment">当前计数：{{counter}}</button>
    </div>
</template>
<script>
import { ref } from 'vue';
export default {
    setup() {
        const counter = ref(0);

        const increment = () => counter.value++;

        return {
            counter,
            increment
        }
    },
    directives: {
        yzh: {
            created(el, bindgings, vnode, preVnode) {
                console.log("yzh created")
                console.log(el, bindgings, vnode, preVnode)
                console.log(el.textContent)
                console.log(bindgings.value) //传的参数
                console.log(bindgings.modifiers)  //修饰符
            },
            beforeMount() {
                console.log("yzh beforeMount")
            },
            mounted() {
                console.log("yzh mounted")
            },
            beforeUpdate() {
                console.log("yzh beforeUpdate")
            },
            updated() {
                console.log("yzh updated")
            },
            beforeUnmount() {
                console.log("yzh beforeUnmount")
            },
            unmounted() {
                console.log("yzh unmounted")
            },
        }
    }
}
</script>
<style>
</style>
